$(function () {
    var loading = false;
    //分页允许返回的最大条数
    var maxItems = 999;
    //一页返回的最大条数
    var pageSize = 1;
    //获取帖子正文的url
    var contentUrl = '/topic/getTopicInfo';
    //获取帖子正文下方评论的url
    var commentUrl = '/comment/getCommentList';
    //发表评论
    var postUrl = '/comment/postComment';
    //为帖子点赞或收藏
    var thumbOrCollectUrl = '/topic/thumbOrCollect';
    //添加/更新浏览记录
    var addFootPrintUrl = '/topic/addFootPrint';
    //页码
    var pageNum = 1;
    //从地址栏URL里尝试获取topicId
    var topicId = getQueryString('topicId');
    var blankSpace = '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;';
    var myPhotoBrowserStandalone;
    var flag = false;

    var isCollect;
    var isThumb;

    //浏览话题时更新用户的浏览记录
    addFootPrint();
    //渲染出帖子正文内容
    getTopicContent();
    //预先加载10条正文内容对应的评论
    addComment(pageSize,pageNum);


    function addFootPrint() {
        var url = addFootPrintUrl + '?topicId='+topicId;
        $.ajax({
            url: url,
            type: 'GET',
            contentType:false,
            processData:false,
            cache:false,
            beforeSend: function(request){
                request.setRequestHeader("Token",localStorage.getItem('token'));
            },
            success:function (data) {
                console.log(data.success);
            }
        })
    }


    function getTopicContent() {

        //拼接出查询的url,赋空值默认就去掉这个条件限制,有值就代表按这个条件去筛选
        var url = contentUrl+'?topicId='+topicId+'&token='+localStorage.getItem('token');
        //访问后台获取相关条件的信息
        $.getJSON(url,function (data) {
           if (data.success){
               console.log(data);
               //帖子标题
               $('.title').html(data.data.topicCategoryName);
               //贴主头像
               $('#headImg').attr("src",data.data.personInfo.headImg);
               //用户名
               $('.facebook-name').html(data.data.personInfo.username);
               //发帖时间
               $('.facebook-date').html(new Date(data.data.lastEditTime).Format("yyyy-MM-dd"));
               //标题
               $('#headline').html(data.data.topicName);
               //主要内容
               $('#main_content').html(data.data.topicDesc);
               //点赞数、评论数、收藏数
               $('#thumb-num').text(data.data.topicThumbNum);
               $('#comment-num').text(data.data.topicDiscussNum);
               $('#collect-num').text(data.data.topicCollectionNum);
               //是否有对该帖子进行点赞,如果有则设置其颜色为红色,反之则不用
               if (data.data.collect) {
                   //有点赞,则设置为红色
                   $('.icon-star').css('color','red');
                   isCollect = true;
               }else {
                   $('.icon-star').css('color','');
                   isCollect = false;
               }
               //同样对帖子的收藏也进行同样的操作
               if (data.data.thumb){
                   $('.icon-emoji').css('color','red');
                   isThumb = true;
               } else {
                   $('.icon-emoji').css('color','');
                   isThumb = false;
               }
               //如果帖子包含图片,则添加图片
               if (data.data.topicImgList!=null){
                   flag = true;
                   var photos = [];
                   data.data.topicImgList.map(function (item,index) {
                       var html = '<img src="'+getContextPath()+item.imgAddr+'"  width="100%"><br/>';
                       photos.push(getContextPath()+item.imgAddr);
                       $('.card-content').append(html);
                   });
                   myPhotoBrowserStandalone = $.photoBrowser({
                       photos : photos
                   });
               }
               // <video  width=100% height="240"  controls>
               // <source src="" type="video/mp4">
               //     您的浏览器不支持 video 标签。
               // </video>
               //如果帖子中含有视频则添加视频的url
               if (data.data.video != null&&data.data.video.videoUrl!=''){
                   //显示播放器并添加视频url
                   var video = '<video  width=100% height="240"  controls><source src="'+data.data.video.videoUrl+
                       '" type="video/mp4">'+'您的浏览器不支持 video 标签。'+'</video>'
                   $('.video').html(video);
               }
           }
        });
    }

    //点击时打开图片浏览器
    $(document).on('click','.pb-standalone',function () {
        if (flag) {
            myPhotoBrowserStandalone.open();
        }
    });

    function addComment(pageSize,pageIndex) {
        //拼接出查询的url,赋空值默认就去掉这个条件限制,有值就代表按这个条件去筛选
        var url = commentUrl+'?'+'pageIndex='+pageIndex+'&pageSize='
            +pageSize+'&topicId='+topicId;
        loading = true;
        //访问后台获取相应数量的评论
        $.getJSON(url,function (data) {
            if (data.success){
                //查询出当前帖子的评论总数
                maxItems = data.count;
                var html = '';
                //遍历评论列表,拼接出卡片集合
                data.data.map(function (item,index) {
                    html += '<div class="card" data-comment-id="'+item.topicCommentId+'">'
                        +'<div class="card-header">'+'<div class="row no-gutter">'
                        +'<div class="col-20">'+'<img src="'+getContextPath()+item.personInfo.headImg+'" width="40" height="40">'
                        +'</div>'+'<div class="col-80">'+blankSpace+item.personInfo.username+'</div></div></div>'
                        +'<div class="card-content">'+'<div class="list-block media-list">'+'<ul>'
                        +'<li class="item-content">'+'<div class="content-padded">'+'<p>'+item.content+'</p>'
                        +'</div></li></ul></div></div>'+'<div class="card-footer content-padded docs-icons">'
                        +'<span class="icon icon-clock">'+new Date(item.createTime).Format("yyyy-MM-dd")+'</span>'+' <span class="icon icon-edit">'
                        +'回复'+'</span>'+'<span class="icon icon-message">'+item.commentNum+'&nbsp;评论'+'</span>'
                        +'</div>'+'</div>';
                });
                //将卡片集合添加到目标HTML组件里
                $('#comment_content').append(html);
                //获取目前为止已显示的卡片总数,包含之前已经加载的
                var total = $('.comment-list .card').length;
                //若总数达到跟按照此条件查询列出来的总数一致,则停止后天的加载
                if(total>=maxItems){
                    $('.infinite-scroll-preloader').css('display','none');
                }else {
                    $('.infinite-scroll-preloader').css('display','block');
                }
                //否则页码加1,继续load出新的店铺
                pageNum +=1;
                //加载结束,可以再次加载了
                loading = false;
                //刷新页面,显示新加载的店铺
                $.refreshScroller();
            }
        });
    }

    //下滑屏幕自动进行分页搜索
    $(document).on('infinite','.infinite-scroll-bottom',function () {
        // 如果正在加载，则退出
        if (loading)
            return;
        addComment(pageSize,pageNum);
    });

    //点击评论的卡片进入该评论的子评论(等一下在实现)
    $('#comment_content').on('click','.card',function (e) {
        var commentId = e.currentTarget.dataset.commentId;
        window.location.href = '/topic/topicReply?commentId='+commentId+'&&topicId='+topicId+'&&num='+$('#comment-num').text();
    });

    //点击评论的按钮显示输入框进行评论
    var discussinput = false;
    $('.discuss').click(function () {
        if (!discussinput){
            $('.icon-message').css('color','#1e9fff');
            $('#comment_input').css('display','block');
            discussinput=true;
        } else {
            $('.icon-message').css('color','');
            discussinput=false;
            $('#comment_input').css('display','none');
        }
    });
    //发表评论
    $('#post').click(function () {
        var url = postUrl + '?topicId='+topicId+'&type=true&content='+$('#Discuss').val();
        $.ajax({
            url:url,
            type:"POST",
            contentType:false,
            processData:false,
            cache:false,
            beforeSend: function(request){
                request.setRequestHeader("Token",localStorage.getItem('token'));
            },
            success:function (data) {
                console.log(data);
                $.toast(data.message);
                if (data.success){
                    // $('#comment_content').empty()
                    // $('#comment-num').text(data.commentnum);
                    //重置页码
                    pageNum=1;
                    addComment(pageSize,pageNum);
                    $('#Discuss').val("");
                }
            }
        })

    });

    //对帖子的点赞
    $('.icon-emoji').click(function () {
        //获取当前的点赞数
        var url = thumbOrCollectUrl+'&type=true&&topicId='+topicId;
        $.ajax({
            url: url,
            type: 'GET',
            contentType:false,
            processData:false,
            cache:false,
            beforeSend: function(request){
                request.setRequestHeader("Token",localStorage.getItem('token'));
            },
            success:function (data) {
                console.log(data);
                if (data.success){
                    if (!isThumb) {
                        //点赞
                        $('.icon-emoji').css('color','red');
                        isThumb = true;
                    }else {
                        //取消点赞
                        $('.icon-emoji').css('color','');
                        isThumb = false;
                    }
                } else {
                    $.toast(data.message);
                }
            }
        });
        // $.getJSON(url,function (data) {
        //     if (data.success){
        //         if (!isThumb) {
        //             //点赞
        //             $('.icon-emoji').css('color','red');
        //             isThumb = true;
        //         }else {
        //             //取消点赞
        //             $('.icon-emoji').css('color','');
        //             isThumb = false;
        //         }
        //     } else {
        //         $.toast(data.message);
        //     }
        // })
    });

    //对帖子进行收藏
    $('.icon-star').click(function () {
        var url = thumbOrCollectUrl+'&type=false&&topicId='+topicId;
        $.ajax({
            url: url,
            type: 'GET',
            contentType:false,
            processData:false,
            cache:false,
            beforeSend: function(request){
                request.setRequestHeader("Token",localStorage.getItem('token'));
            },
            success:function (data) {
                if (data.success){
                    //同样对帖子的收藏也进行同样的操作
                    if (!isCollect){
                        $('.icon-star').css('color','red');
                        isCollect = true;
                    } else {
                        $('.icon-star').css('color','');
                        isCollect = false;
                    }
                } else {
                    $.toast(data.message);
                }
            }
        });

    });

    //初始化页面 不知道为什么会出错TypeError: c[0] is undefined
    $.init();

});


























